<!--
 * @Author: Aaron Huang
 * @Date: 2022-10-19 14:04:40
 * @LastEditors: Aaron Huang
 * @LastEditTime: 2022-11-16 14:29:16
 * @Description: file content
 * @FilePath: \ias_ui\src\views\coi\CBEC\components\modifyList.vue
 * @Company: 沃尔玛
-->
<template>
  <essTable
    v-loading="loading"
    :table-columns="tableColumns"
    :table-data="tableData"
    :total="total"
    :page-params="pageParams"
    @pageParamsChange="queryTableDataFun"
  >
    <template v-slot:table-header>
      <searchHead
        :search-data="searchData"
        :search-list="searchList"
        :options="options"
        @itemNbrListInput="(value, item) => checkNumberList(value, item, 15, 500)"
        @skuListInput="(value, item) => checkNumberList(value, item, 12, 500)"
        @deptNbrInput="(value, item) => checkNumberList(value, item, 2, 50)"
        @handleSearch="handleSearch"
        @handleReset="handleReset"
        @handleExport="handleExport"
      />
      <div class="btn">
        <el-button type="primary" size="mini" icon="el-icon-refresh" round :disabled="hasRePush" @click="open('确定重新推送选中数据？', rePush)">
          重新推送
        </el-button>
      </div>
    </template>

    <template v-slot:sku="{ scope: { row } }">
      <span class="el-button--text el-button--mini" @click="goDetail(row, 'detail')">{{ row.sku }}</span>
    </template>

    <template v-slot:operation="{ scope: { row } }">
      <el-button v-if="editBtnShow(row)" type="text" size="mini" @click="goDetail(row, 'edit')">编辑</el-button>
      <el-button type="text" size="mini" @click="operationLog(row)">日志</el-button>
    </template>

    <template v-slot:container>
      <operation-log ref="operationLogRef" :table-data="logData" :log-list="logList">
        <template v-slot:createdTime="{ scope }">
          {{ transDate(scope.row.createdTime) }}
        </template>
      </operation-log>
    </template>
  </essTable>
</template>

<script>
import moment from 'moment'
import essTable from '@/components/newTable/index.vue'
import searchHead from '@/components/searchHead/newSearch.vue'
import { tableColumns, searchList, options } from '../js/modifyListPageParams'
import { modifyStatusCode } from '../js/dictionary'
import { initializeData, searchHeaderEvent, initializeMethod, checkBoxFun } from '@/components/newTable/index'
import {
  maintainList_CBEC_API as queryTableDataApi,
  maintainListExportFile_CBEC_API as exportTableDataApi,
  rePush_CBEC_API as rePushApi
} from '@/api/coi/CBEC/maintainProducts'
import { operationLogByProcessId } from '@/api/coi/onlineTaskAPI/sku'
import { checkNumberList } from '@/components/searchHead/js/checkInput.js'
import { tableMixins } from '../js/tableMixins'
import { commodityMaintainLog as logList } from '@/views/coi/commonJs/operationLogList'
import eventBus from '@/utils/eventBus'
import operationLog from '@/views/coi/components/operationLog.vue'

export default {
  name: 'ModifyList',
  components: {
    essTable,
    searchHead,
    operationLog
  },
  mixins: [initializeData, searchHeaderEvent, initializeMethod, checkNumberList, checkBoxFun, tableMixins],
  data() {
    return {
      tableColumns,
      queryTableDataApi,
      exportTableDataApi,
      rePushApi,
      searchList,
      options,
      exportFileName: 'SKU_CBEC_维护',
      logList,
      logData: [] // 操作日志
    }
  },
  computed: {
    hasRePush() {
      // 列表的状态值是string 枚举是number
      // eslint-disable-next-line
      return !(this.multipleSelection?.length && this.multipleSelection?.every((item) => item.mainStatus == modifyStatusCode.CHANGING))
    }
  },
  methods: {
    transDate(v) {
      if (v === null) {
        return ''
      }
      return moment(v).format('YYYY-MM-DD HH:mm:ss')
    },
    editBtnShow({ mainStatus }) {
      return [modifyStatusCode.CHANGING].includes(Number(mainStatus))
    },
    goDetail(row, type) {
      eventBus.$emit('setTagName', row.skuName)
      this.$router.push({
        path: `/CBEC/edit/${row.id}/${type}/${this.$route.name}/safeguard`,
        query: {
          processId: row.id,
          channelId: row.channelId
        }
      })
    },
    // 操作日志
    async operationLog(row) {
      const { result } = await operationLogByProcessId(row.id)
      if (Array.isArray(result) && result.length) {
        this.$refs.operationLogRef.dialogVisible = true
        this.logData = result
      } else {
        this.$message({
          type: 'warning',
          message: '未查询到该商品线上建品的操作日志'
        })
      }
    }
  }
}
</script>

<style lang="scss" scoped>
@import url('../css/list.scss');
</style>
